翻訳サービスDeepLを使ったSlackアプリを設定してみる

ご機嫌いかがでしょうか、豊崎です。

現在、クラスメソッドでは外国籍のメンバーが増えてきており、社内のSlack上でも母国語ではない英語や日本語でのやりとりが増えています。それに伴い、社員が翻訳サイトを利用する機会も増えてきています。

業務に関係しない日常会話であれば、フリーの翻訳サイトを利用しても問題ありませんが、業務的な内容の場合、翻訳サイトのホスト側にテキストが保存されるような翻訳サービスは避けたいと考えました。

いくつか調べている中で、翻訳の精度の高いDeepLを見つけました。無料で利用する場合、翻訳されたテキストは翻訳の精度を高めるために機械学習に利用されますが、有償版では翻訳されたテキストは即時破棄され情報が保存されることはないそうです。

本ブログでは、翻訳サービスであるDeepL APIを契約して、翻訳機能を持ったSlackアプリの導入を試してみようと思います。

今回は以下のGithubとQiitaを参考にSlackアプリを作っていきたいと思います。

先にどんなことが実装できたのかのキャプチャを貼っておきます。コメントに翻訳したい国旗をつけることで、Slackアプリが翻訳してくれます。

 

参考

ちなみにDeepL APIを使ったSlackアプリの作成に関してはSlack開発エンジニアのSera Kazuhiroさんの用意したものをなぞっただけなので、お試しになられる際はGithubまたはQiitaもご参考いただくのが良いと思います。

https://github.com/seratch/deepl-for-slack

https://qiita.com/seratch/items/a001985ee1dccaf95727

準備

まず準備として以下が必要です。

• DeepL APIの契約
• Herokuアカウント
• Slack ワークスペース と ユーザアカウント

DeepLの契約と認証キー

DeepL APIの契約を行いました。

契約後、DeepLの管理画面にログインし、プラン > DeepL APIで使用する認証キーを確認し、認証キーを控えておきます。

Slackワークスペース

これはクラスメソッドが業務で使用しているSlack ワークスペースを利用します。

Heroku

Herokuのアカウントは事前に作成してログインしておきました。テストなので今回は無料枠で利用をします。

やってみた

Slackアプリの設定 -part1-

まずはSlack Appを作っていきます。

Slackのワークスペースにログインした状態で以下のURLをクリックします。 https://api.slack.com/apps?new_app=1

すると、Create a Slack Appの画面が表示されるので、以下のように入力しました。

• App Name : interpreter-clanyan(任意)
• Development Slack Workspace : アプリを作成したいワークスペース

次に左ペインの Features > OAuth & Permissions に移動し、Scopesから以下4つを追加します。

• channels:history
• chat:write
• groups:history
• reactions:read

追加したら、左ペインの Settings > Install App から Install to WorkSpace をクリックしました。すると、Bot User Access Tokenが表示されるので控えておきます。

さらに Settings > Basic Information からSigning Secretを表示させてこちらも控えておきます。

Herokuを利用する

Herokuにログインした状態で、以下のURLをクリックします。

https://heroku.com/deploy?template=https://github.com/seratch/deepl-for-slack/tree/master

すると以下のような画面が表示されます。

赤枠で囲った箇所にこれまで控えた値を入力してDeploy appをクリックします。

• App name : (任意)
• DEEPL_AUTH_KEY : DeepLの認証キー
• SLACK_BOT_TOKEN : SlackのAccess Token
• SLACK_SIGNING_SECRET : SlackのSigning Secret

なお、翻訳対象の言語はここでは以下としています。

• "DE" - German
• "EN" - English
• "FR" - French
• "IT" - Italian
• "JA" - Japanese
• "ES" - Spanish
• "NL" - Dutch
• "PL" - Polish
• "RU" - Russian
• "ZH" - Chinese

デプロイが正常に完了すると、Settings > DomainsからURLhttps://{app name}.herokuapp.com/ が参照できますので、控えておきます。

また必要に応じてDyno Typeを変更して下さい。（本ブログはテストなのでFreeを利用しています）

Slackアプリの設定 -part2-

Slack Appの画面に戻ってFeatures > Event Subscriptionsをクリックし以下を実施します。

• 右上のOFFをONに変更
• Request URLにhttps://{app name}.herokuapp.com/slack/eventsと入力
• Add Bot Eventをクリックしreaction_addedを追加

上記はSlack上のコメントに特定のアクションを認識し翻訳をするために必要な設定です。

表示されるアイコンも変えておきます。

Settings > Basic Infomation > Display Infomationの設定を以下のようにしました。この部分の設定は完全に任意なのでやってもやらなくてもOKです。

最後に、Settings > Install App から Reinsatall to Workspaceをクリックして完了です。

Slack上で使ってみる

テスト用にSlackチャンネル#test-deeplを作って、Slackアプリ(interpreter-clanyan)を招待しました。実際に利用する場合は任意のチャンネルでSlackアプリを招待して下さい。

そこでGithubにあるサンプルテキストを入力しアクションを付けてみます。

翻訳されたテキストがスレッドに表示されました。対応している言語であれば、どの言語からどの言語への翻訳も可能です。

なお、それぞれの言語への変換はSlackのデフォルトアイコンとリンクしています。

キーボードから入力する場合はこちら

:flag-de: - German
:flag-us: - English
:flag-fr: - French
:flag-it: - Italian
:flag-jp: - Japanese
:flag-es: - Spanish
:flag-nl: - Dutch
:flag-pl: - Polish
:flag-ru: - Russian
:flag-cn: - Chinese

さいごに

DeepL APIを利用してSlackアプリを設定することで、DeepLのホスト側にデータを保存せずに、みんなでシェアして翻訳の機能を使うことができるようになりました。そしてこれは希望ですが、これをきっかけに不得意な言語が障壁で会話できていなかった人たちで新たなコミュニケーションが生まれれば嬉しいなと考えています。

Special Thanks

Slack 開発エンジニア Sera Kazuhiroさん